<template>
  <!-- <mt-tabbar v-model="message" fixed> -->
  <!-- <mt-tab-item id="one">
      <img slot="icon" src="../assets/images/home.png" />
      首页
    </mt-tab-item>
    <mt-tab-item id="two">
      <img slot="icon" src="../assets/images/me1.png" />
      我的
    </mt-tab-item>
  </mt-tabbar>-->
  <div class="footer">
    <div>
      <img @click="btn_index" src="../assets/images/hd1.png" />
      <span>醉乡之行</span>
    </div>
    <div>
      <img src="../assets/images/jp_ok.png" />
      <span style="color:#ff4d4f">积分兑换</span>
    </div>
    <div @click="btn_me">
      <img src="../assets/images/my1.png" />
      <span>我的</span>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      //选中的tabbar值message为外面页面传入的值selected
      //这里使用的icon图标为图片，所以需要加图片改变的传入，若使用阿里图标，则不用加
    };
  },
  methods: {
    // goMe() {
    //   this.$router.push("/me");
    // }
    btn_index() {
      this.$router.push("/index");
    },
    btn_me() {
      this.$router.push("/me");
    }
  }
  // props: {
  //   selected: String,
  //   tabs: Array
  // },
  // watch: {
  //   message: function(val, oldVal) {
  //     console.log(val, "11111");
  //     // 这里就可以通过 val 的值变更来确定去向
  //     switch (val) {
  //       // case "one":
  //       //   this.$router.push("/index");
  //       //   break;
  //       case "two":
  //         this.$router.push("/me");
  //         break;
  //     }
  //   }
  // }
};
</script>
<style lang="less" scoped>
.footer {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3.5rem;
  background: #fafafa;
  div {
    width: 33.33%;
    float: left;
    text-align: center;
    img {
      width: 1.5rem;
      margin-top: 0.5rem;
    }
    span {
      display: block;
      font-size: 0.8rem;
    }
  }
}
</style>